<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>

<body>
  <h1>axios基础使用</h1>
  <button id="btn">发送请求</button>
  <script>
    const oBtn = document.getElementById('btn');
    oBtn.onclick = async function(){
      try {
        const re = await axios({
          url: '/user',
          method: 'get',
          Headers: {},
          data: {},
          params: {
            userId: '001'
          },
          timeout: 1000
        })
        console.log(re.data);
      } catch (e) {
        console.log(e.message);
      }
    }
    // oBtn.onclick = async function(){
    //   try {
    //     const re = await axios({
    //       url: '/user',
    //       method: 'get',
    //       Headers: {},
    //       params: {
    //         userId: '001'
    //       },
    //       data: {},
    //       timeout: 1000
    //     })

    //     console.log(re.data);
    //   } catch (e) {
    //     console.log(e.message);
    //   }
      
    // }
    // oBtn.onclick = async function(){
    //   try {
    //     const re = await axios({
    //       url: '/user',
    //       method: 'get',
    //       Headers: {},
    //       params: {
    //         userId: '001'
    //       },
    //       data: {},
    //       timeout: 1000
    //   })
    //   console.log(re.data);
    //   } catch (e) {
    //     console.log(e.message);
    //   }
     
    // }
    // oBtn.onclick = async function(){
    //   try {
    //     const re1 = await axios({
    //       url: '/user',
    //       method: 'get',
    //       headers: {},
    //       params: {
    //         userId: '001'
    //       },
    //       data: {},
    //       timeout: 1000
    //     })
    //     console.log(re1);
    //     console.log(re1.message);
    //   } catch (e) {
    //     console.log(e.message);
    //   }
    // }
    // oBtn.onclick = async function () {
    //   try {
    //     /* 
    //       axios请求接受一个配置对象
    //       axios方法返回一个promise实例,成功的被re接受了,如果请求失败则进入catch异常处理中
    //     */
    //     const re = await axios({
    //       url: "/user",
    //       method: "get",
    //       headers: {},
    //       //即将与请求一起发送的url参数
    //       params: {
    //         userId: "001"
    //       },
    //       //请求体参数,只适用于post和put
    //       data: {},
    //       timeout: 10000,
    //     })
    //     /* 
    //       axios成功的值这个对象属性解析:
    //         - config:是axios请求的时候传入的配置对象
    //         - data:后端响应的数据
    //         - headers:响应头
    //         - request:底层真正使用的xhr实例对象
    //         - status:响应状态码
    //         - statusText:响应状态描述
    //     */
    //     console.log(re);
    //     console.log(re.data);
    //   } catch (e) {
    //     console.log(e.message)
    //   }
    // }
  </script>
</body>

</html>